JavaScript非同期パターンマッチング：非同期パターンの評価

            async function processApiResponse(responsePromise) {
  try {
    const response = await responsePromise;
    const { status, data, error } = response;

    if (status === 200 && data) {
      console.log('Data successfully received:', data);
      // Further processing with 'data'
    } else if (status === 404) {
      console.error('Resource not found.');
    } else if (error) {
      console.error('An error occurred:', error.message);
    } else {
      console.warn('Unknown response status:', status);
    }
  } catch (e) {
    console.error('Network or unhandled error:', e.message);
  }
}

// Example usage:
const successResponse = Promise.resolve({ status: 200, data: { id: 1, name: 'Product A' } });
const notFoundResponse = Promise.resolve({ status: 404 });
const errorResponse = Promise.resolve({ status: 500, error: { message: 'Server error' } });

processApiResponse(successResponse);
processApiResponse(notFoundResponse);
processApiResponse(errorResponse);

            

              
                Copy
              
            
          

            async function handlePaymentStatus(paymentPromise) {
  const result = await paymentPromise;

  if (result.status === 'success' && result.amount > 0) {
    console.log(`Payment successful for ${result.amount} ${result.currency}. Transaction ID: ${result.transactionId}`);
    // Send confirmation email, update order status
  } else if (result.status === 'failed' && result.reason === 'insufficient_funds') {
    console.error('Payment failed: Insufficient funds. Please top up your account.');
    // Prompt user to update payment method
  } else if (result.status === 'pending' && result.attempts < 3) {
    console.warn('Payment pending. Retrying in a moment...');
    // Schedule a retry
  } else if (result.status === 'failed') {
    console.error(`Payment failed for an unknown reason: ${result.reason || 'N/A'}`);
    // Log error, notify admin
  } else {
    console.log('Unhandled payment status:', result);
  }
}

// Example usage:
handlePaymentStatus(Promise.resolve({ status: 'success', amount: 100, currency: 'USD', transactionId: 'TXN123' }));
handlePaymentStatus(Promise.resolve({ status: 'failed', reason: 'insufficient_funds' }));
handlePaymentStatus(Promise.resolve({ status: 'pending', attempts: 1 }));

            

              
                Copy
              
            
          

            // Assuming 'ts-pattern' is installed: npm install ts-pattern
import { match, P } from 'ts-pattern';

async function processSensorData(dataPromise) {
  const data = await dataPromise; // Await the async data

  return match(data)
    .with({ type: 'temperature', value: P.number.gte(30) }, (d) => {
      console.log(`High temperature alert: ${d.value}°C in ${d.location || 'unknown'}`);
      return 'ALERT_HIGH_TEMP';
    })
    .with({ type: 'temperature', value: P.number.lte(0) }, (d) => {
      console.log(`Low temperature alert: ${d.value}°C in ${d.location || 'unknown'}`);
      return 'ALERT_LOW_TEMP';
    })
    .with({ type: 'temperature' }, (d) => {
      console.log(`Normal temperature: ${d.value}°C`);
      return 'NORMAL_TEMP';
    })
    .with({ type: 'humidity', value: P.number.gte(80) }, (d) => {
      console.log(`High humidity alert: ${d.value}%`);
      return 'ALERT_HIGH_HUMIDITY';
    })
    .with({ type: 'humidity' }, (d) => {
      console.log(`Normal humidity: ${d.value}%`);
      return 'NORMAL_HUMIDITY';
    })
    .with(P.nullish, () => {
      console.error('No sensor data received.');
      return 'ERROR_NO_DATA';
    })
    .with(P.any, (d) => {
      console.warn('Unknown sensor data pattern:', d);
      return 'UNKNOWN_DATA';
    })
    .exhaustive(); // Ensures all patterns are handled
}

// Example usage:
processSensorData(Promise.resolve({ type: 'temperature', value: 35, location: 'Server Room' }));
processSensorData(Promise.resolve({ type: 'humidity', value: 92 }));
processSensorData(Promise.resolve({ type: 'light', value: 500 }));
processSensorData(Promise.resolve(null));

            

              
                Copy
              
            
          

            const value = ...;

match (value) {
  when pattern1 => expression1,
  when pattern2 if guardCondition => expression2,
  when [a, b, ...rest] => expression3,
  when { prop: 'value' } => expression4,
  when default => defaultExpression
}

            

              
                Copy
              
            
          

            async function handlePaymentResponse(paymentPromise) {
  const response = await paymentPromise; // Resolve the promise first

  return match (response) {
    when { status: 'SUCCESS', transactionId } => {
      console.log(`Payment successful! Transaction ID: ${transactionId}`);
      return { type: 'success', transactionId };
    },
    when { status: 'FAILED', reason: 'INSUFFICIENT_FUNDS' } => {
      console.error('Payment failed: Insufficient funds.');
      return { type: 'error', code: 'INSUFFICIENT_FUNDS' };
    },
    when { status: 'FAILED', reason } => {
      console.error(`Payment failed for reason: ${reason}`);
      return { type: 'error', code: reason };
    },
    when { status: 'PENDING', retriesRemaining: > 0 } if response.retriesRemaining < 3 => {
      console.warn('Payment pending, retrying...');
      return { type: 'pending', retries: response.retriesRemaining };
    },
    when { status: 'ERROR', message } => {
      console.error(`System error processing payment: ${message}`);
      return { type: 'system_error', message };
    },
    when _ => {
      console.warn('Unknown payment response:', response);
      return { type: 'unknown', data: response };
    }
  };
}

// Example usage:
handlePaymentResponse(Promise.resolve({ status: 'SUCCESS', transactionId: 'PAY789' }));
handlePaymentResponse(Promise.resolve({ status: 'FAILED', reason: 'INSUFFICIENT_FUNDS' }));
handlePaymentResponse(Promise.resolve({ status: 'PENDING', retriesRemaining: 2 }));
handlePaymentResponse(Promise.resolve({ status: 'ERROR', message: 'Database unreachable' }));

            

              
                Copy
              
            
          

            // Purely speculative syntax for direct async matching:
async function advancedApiCall(apiPromise) {
  return match (apiPromise) {
    when Promise.pending => 'Loading data...', // Match on the Promise state itself
    when Promise.fulfilled({ status: 200, data }) => `Data received: ${data.name}`,
    when Promise.fulfilled({ status: 404 }) => 'Resource not found!',
    when Promise.rejected(error) => `Error: ${error.message}`,
    when _ => 'Unexpected async state'
  };
}

// And for Observables (RxJS-like):
import { fromEvent } from 'rxjs';
import { map } from 'rxjs/operators';

const clickStream = fromEvent(document, 'click').pipe(
  map(event => ({ type: 'click', x: event.clientX, y: event.clientY }))
);

clickStream.subscribe(event => {
  match (event) {
    when { type: 'click', x: > 100 } => console.log(`Clicked right of center at ${event.x}`),
    when { type: 'click', y: > 100 } => console.log(`Clicked below center at ${event.y}`),
    when { type: 'click' } => console.log('Generic click detected'),
    when _ => console.log('Unknown event')
  };
});

            

              
                Copy
              
            
          

            async function fetchDataAndProcess(url) {
  try {
    const response = await fetch(url);
    const json = await response.json();

    // Using a pattern matching library or future native syntax:
    return match ({ status: response.status, data: json })
      .with({ status: 200, data: { user } }, ({ data: { user } }) => {
        console.log(`User data retrieved for ${user.name}.`);
        return { type: 'USER_LOADED', user };
      })
      .with({ status: 200, data: { product } }, ({ data: { product } }) => {
        console.log(`Product data retrieved for ${product.name}.`);
        return { type: 'PRODUCT_LOADED', product };
      })
      .with({ status: 404 }, () => {
        console.warn('Resource not found.');
        return { type: 'NOT_FOUND' };
      })
      .with({ status: P.number.gte(400), data: { message } }, ({ data: { message } }) => {
        console.error(`API error: ${message}`);
        return { type: 'API_ERROR', message };
      })
      .with(P.any, (res) => {
        console.log('Unhandled API response:', res);
        return { type: 'UNKNOWN_RESPONSE', res };
      })
      .exhaustive();

  } catch (error) {
    console.error('Network or parsing error:', error.message);
    return { type: 'NETWORK_ERROR', message: error.message };
  }
}

// Example usage:
fetchDataAndProcess('/api/user/123');
fetchDataAndProcess('/api/product/ABC');
fetchDataAndProcess('/api/nonexistent');

            

              
                Copy
              
            
          

            // Example for a React-like reducer using pattern matching
// (assuming 'ts-pattern' or similar, or future native match)
import { match, P } from 'ts-pattern';

const initialState = { status: 'idle', data: null, error: null };

function dataReducer(state, action) {
  return match (action)
    .with({ type: 'FETCH_STARTED' }, () => ({ ...state, status: 'loading' }))
    .with({ type: 'FETCH_SUCCESS', payload: { user } }, ({ payload: { user } }) => ({ ...state, status: 'success', data: user }))
    .with({ type: 'FETCH_SUCCESS', payload: { product } }, ({ payload: { product } }) => ({ ...state, status: 'success', data: product }))
    .with({ type: 'FETCH_FAILED', error }, ({ error }) => ({ ...state, status: 'error', error }))
    .with(P.any, () => state) // Fallback for unknown actions
    .exhaustive();
}

// Simulate async dispatch
async function dispatchAsyncActions() {
  let currentState = initialState;
  console.log('Initial State:', currentState);

  // Simulate fetch start
  currentState = dataReducer(currentState, { type: 'FETCH_STARTED' });
  console.log('After FETCH_STARTED:', currentState);

  // Simulate async operation
  try {
    const userData = await Promise.resolve({ id: 'user456', name: 'Jane Doe' });
    currentState = dataReducer(currentState, { type: 'FETCH_SUCCESS', payload: { user: userData } });
    console.log('After FETCH_SUCCESS (User):', currentState);
  } catch (e) {
    currentState = dataReducer(currentState, { type: 'FETCH_FAILED', error: e.message });
    console.log('After FETCH_FAILED:', currentState);
  }

  // Simulate another fetch for a product
  currentState = dataReducer(currentState, { type: 'FETCH_STARTED' });
  console.log('After FETCH_STARTED (Product):', currentState);
  try {
    const productData = await Promise.reject(new Error('Product service unavailable'));
    currentState = dataReducer(currentState, { type: 'FETCH_SUCCESS', payload: { product: productData } });
    console.log('After FETCH_SUCCESS (Product):', currentState);
  } catch (e) {
    currentState = dataReducer(currentState, { type: 'FETCH_FAILED', error: e.message });
    console.log('After FETCH_FAILED (Product):', currentState);
  }
}

dispatchAsyncActions();

            

              
                Copy
              
            
          

            // Imagine this is a function receiving messages from a WebSocket
async function handleWebSocketMessage(messagePromise) {
  const message = await messagePromise;

  // Using native pattern matching (when available)
  match (message) {
    when { type: 'USER_CONNECTED', userId, username } => {
      console.log(`User ${username} (${userId}) connected.`);
      // Update online user list
    },
    when { type: 'CHAT_MESSAGE', senderId, content: P.string.startsWith('@') } => {
      console.log(`Private message from ${senderId}: ${message.content}`);
      // Display private message UI
    },
    when { type: 'CHAT_MESSAGE', senderId, content } => {
      console.log(`Public message from ${senderId}: ${content}`);
      // Display public message UI
    },
    when { type: 'ERROR', code, description } => {
      console.error(`WebSocket Error ${code}: ${description}`);
      // Show error notification
    },
    when _ => {
      console.warn('Unhandled WebSocket message type:', message);
    }
  };
}

// Example message simulations
handleWebSocketMessage(Promise.resolve({ type: 'USER_CONNECTED', userId: 'U1', username: 'Alice' }));
handleWebSocketMessage(Promise.resolve({ type: 'CHAT_MESSAGE', senderId: 'U1', content: '@Bob Hello there!' }));
handleWebSocketMessage(Promise.resolve({ type: 'CHAT_MESSAGE', senderId: 'U2', content: 'Good morning everyone!' }));
handleWebSocketMessage(Promise.resolve({ type: 'ERROR', code: 1006, description: 'Server closed connection' }));

            

              
                Copy
              
            
          

            class CustomNetworkError extends Error {
  constructor(message, statusCode) {
    super(message);
    this.name = 'CustomNetworkError';
    this.statusCode = statusCode;
  }
}

async function performOperation() {
  // Simulate an async operation that might throw different errors
  return new Promise((resolve, reject) => {
    const rand = Math.random();
    if (rand < 0.3) {
      reject(new CustomNetworkError('Service Unavailable', 503));
    } else if (rand < 0.6) {
      reject(new Error('Generic processing error'));
    } else {
      resolve('Operation successful!');
    }
  });
}

async function handleOperationResult() {
  try {
    const result = await performOperation();
    console.log('Success:', result);
  } catch (error) {
    // Using pattern matching on the error object itself
    // (could be with a library or a future native 'match (error)')
    match (error) {
      when P.instanceOf(CustomNetworkError).and({ statusCode: 503 }) => {
        console.error(`Specific Network Error (503): ${error.message}. Please try again later.`);
        // Trigger a retry mechanism
      },
      when P.instanceOf(CustomNetworkError) => {
        console.error(`General Network Error (${error.statusCode}): ${error.message}.`);
        // Log details, maybe notify admin
      },
      when P.instanceOf(TypeError) => {
        console.error(`Type-related Error: ${error.message}. This might indicate a development issue.`);
        // Report bug
      },
      when P.any => {
        console.error(`Unhandled Error: ${error.message}`);
        // Generic fallback error handling
      }
    };
  }
}

for (let i = 0; i < 5; i++) {
  handleOperationResult();
}

            

              
                Copy
              
            
          

            async function displayLocalizedContent(contentPromise, userLocale) {
  const contentData = await contentPromise;

  // Using a pattern matching library or future native syntax:
  return match ({ contentData, userLocale })
    .with({ contentData: { language: P.string.startsWith(userLocale) }, userLocale }, ({ contentData }) => {
      console.log(`Displaying content directly for locale ${userLocale}: ${contentData.text}`);
      return contentData.text;
    })
    .with({ contentData: { defaultText }, userLocale: 'en-US' }, ({ contentData }) => {
      console.log(`Using default English content for en-US: ${contentData.defaultText}`);
      return contentData.defaultText;
    })
    .with({ contentData: { translations }, userLocale }, ({ contentData, userLocale }) => {
      if (translations[userLocale]) {
        console.log(`Using translated content for ${userLocale}: ${translations[userLocale]}`);
        return translations[userLocale];
      }
      console.warn(`No direct translation for ${userLocale}. Using fallback.`);
      return translations['en'] || contentData.defaultText || 'Content not available';
    })
    .with(P.any, () => {
      console.error('Could not process content data.');
      return 'Error loading content';
    })
    .exhaustive();
}

// Example usage:
const frenchContent = Promise.resolve({ language: 'fr-FR', text: 'Bonjour le monde!', translations: { 'en-US': 'Hello World' } });
const englishContent = Promise.resolve({ language: 'en-GB', text: 'Hello, world!', defaultText: 'Hello World' });
const multilingualContent = Promise.resolve({ defaultText: 'Hi there', translations: { 'fr-FR': 'Salut', 'de-DE': 'Hallo' } });

displayLocalizedContent(frenchContent, 'fr-FR');
displayLocalizedContent(englishContent, 'en-US');
displayLocalizedContent(multilingualContent, 'de-DE');
displayLocalizedContent(multilingualContent, 'es-ES'); // Will use fallback or default

            

              
                Copy